<%--
  Created by IntelliJ IDEA.
  User: HW
  Date: 2024/12/20
  Time: 上午10:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ page import="java.sql.*" %>
<%@ page import="com.data.ConnData" %>
<%
    request.setCharacterEncoding("utf-8");
    // 获取要修改的笔记的id，这里假设通过GET方法传递，你可以根据实际情况修改
    String noteId = request.getParameter("note_id");
%>
<%
    ConnData objdata = new ConnData();
    Connection connection = null;
    PreparedStatement psmt = null;
    ResultSet resultSet = null;
    try {
        connection = objdata.getConn();
        String sql = "SELECT note_title, note_content FROM note_table WHERE note_id =?";
        psmt = objdata.getPsmt(sql);
        psmt.setString(1, noteId);
        resultSet = psmt.executeQuery();
        if (resultSet.next()) {
            String originalTitle = resultSet.getString("note_title");
            String originalContent = resultSet.getString("note_content");
%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改笔记</title>
    <link rel="stylesheet" href="../css/bootstrap.css">
    <script src="../js/jquery.js"></script>
    <script src="../js/bootstrap.js"></script>

    <style>
        /* 整体页面布局 */
        body {
            font-family: Arial, sans-serif;
            margin: 0;
        }


        /* 卡片样式 */
        form {
            background-color: white;
            padding: 30px;
            border-radius: 15px; /* 增大圆角半径，更圆润 */
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 调整阴影效果，更柔和 */
            width: 450px;
            margin: 30px auto; /* 让卡片在水平方向居中 */
        }

        /* 标签样式 */
        label {
            display: block;
            font-size: 16px; /* 增大标签字体大小 */
            margin-bottom: 8px;
            color: #333; /* 标签文字颜色，深灰色 */
        }

        /* 输入框和文本域通用样式 */
        input[type="text"],
        textarea {
            width: 100%;
            padding: 12px;
            margin-bottom: 20px;
            border: 1px solid #ccc; /* 浅灰色边框 */
            border-radius: 8px;
            font-size: 14px; /* 输入框文字大小 */
            outline: none; /* 去除输入框获取焦点时的默认外边框 */
            transition: border-color 0.3s ease; /* 边框颜色过渡效果 */
        }

        input[type="text"]:focus,
        textarea:focus {
            border-color: #007bff; /* 输入框获取焦点时边框颜色变化 */
        }


    </style>
</head>
<body>
<!-- 导航栏 -->
<ul class="nav nav-pills" style="padding-top: 20px">
    <li class="nav-item" style="padding-left: 250px">
        <a class="nav-link active" href="conversation.jsp">笔记</a>
    </li>
    <li class="nav-item" style="padding-left: 250px">
        <a class="nav-link" style="color: black" href="question.jsp">题目</a>
    </li>
    <li class="nav-item" style="padding-left: 250px">
        <a class="nav-link" style="color: black" href="rank.jsp">排行榜</a>
    </li>
    <li class="nav-item" style="padding-left: 250px">
        <a class="nav-link" style="color: black" href="me.jsp">我的</a>
    </li>
</ul>
<hr>
<!-- 卡片内容 -->
<div>
    <form action="modify_process.jsp" method="post">
        <input type="hidden" name="note_id" value="<%=noteId%>">
        <label for="modified_title">笔记标题：</label><input type="text" id="modified_title" name="modified_title" value="<%=originalTitle%>" required><br>
        <label for="modified_content">笔记内容：</label><textarea id="modified_content" name="modified_content" required><%=originalContent%></textarea><br>
        <div style="display: flex;
                    justify-content: space-between;">
            <a class="btn btn-success" href="conversation.jsp" style="flex-shrink: 0;">返回</a>
            <input type="submit" class="btn btn-success" value="提交" style="flex-shrink: 0;">
        </div>
    </form>
</div>
</body>
</html>
<%
        }
    } catch (SQLException e) {
        e.printStackTrace();
    } finally {
        if (resultSet!= null) {
            try {
                resultSet.close();
            } catch (SQLException e) {
                e.printStackTrace();
            }
        }
        if (psmt!= null) {
            try {
                psmt.close();
            } catch (SQLException e) {
                e.printStackTrace();
            }
        }
        if (connection!= null) {
            try {
                connection.close();
            } catch (SQLException e) {
                e.printStackTrace();
            }
        }
    }
%>